<template>
    <el-dialog v-model="dialogTableVisible" title="预计算" width="90%">
        <el-table ref="multipleTable" :data="list" v-loading="loading">
            <el-table-column prop="text" label="#" width="60">
            </el-table-column>
            <el-table-column prop="Sum" label="总参与" width="110">
            </el-table-column>
            <!-- <el-table-column prop="Fee" label="总服务费" width="110">
            </el-table-column> -->

            <el-table-column prop="realRate" label="真实比例" width="110">
                <template #default="scope">
                    <div>
                        <el-input v-model="scope.row.realRate" />
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="WinAmount" label="如果赢，则支出" width="150">
            </el-table-column>
            <el-table-column prop="LoseAmount" label="如果输，则支出" width="150">
            </el-table-column>
            <el-table-column prop="realRate" label="结算结果" min-width="240">
                <template #default="scope">
                    <div>
                        <el-radio-group v-model="scope.row.radio" class="ml-4">
                            <el-radio label="2" size="large">赢 {{ scope.row.WinResult || 0 }}</el-radio>
                            <el-radio label="1" size="large">输 {{ scope.row.LoseResult || 0 }}</el-radio>
                        </el-radio-group>
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="Details" label="详情" width="400">
                <template #default="scope">
                    <div>
                        <el-input v-model="scope.row.Details" />
                    </div>
                </template>
            </el-table-column>
            <!-- <el-table-column prop="WinResult" label="赢的结果" width="110">
            </el-table-column>
            <el-table-column prop="LoseResult" label="输的结果" min-width="110">
            </el-table-column> -->
        </el-table>
        <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" :loading="loading" @click="onSubmit('formData')">预计算</el-button>
                <el-button type="warning" @click="onSubmit2">结算</el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script setup>
import { reactive, ref, defineExpose, defineEmits } from 'vue'
import { getOrderResult, settleOrder } from "@/api";
import { ElMessageBox, ElMessage } from "element-plus";
const emit = defineEmits(['loadData'])

const dialogTableVisible = ref(false)
const formData = reactive({ id: "", realRate1: "", realRate2: "", realRate3: "", details1: "", details2: "", details3: "" })
const loading = ref(false)
const loading2 = ref(false)

const list = ref([])
const onSubmit = async () => {
    loading.value = true
    formData.realRate1 = list.value[0]?.realRate || formData.realRate1
    formData.realRate2 = list.value[1]?.realRate || formData.realRate2
    formData.realRate3 = list.value[2]?.realRate || formData.realRate3
    try {
        const res = await getOrderResult(
            formData
        );
        const item = res.data.data.OrderResult || {}
        list.value = [
            {
                text: "一",
                Sum: item.Sum1,
                Fee: item.Fee1,
                realRate: formData.realRate1,
                WinAmount: item.Win1Amount,
                LoseAmount: item.Lose1Amount,
                Details: formData.details1,
                WinResult: ((Number(item.Sum1) - Number(item.Win1Amount)) || 0).toFixed(2),
                LoseResult: ((Number(item.Sum1) - Number(item.Lose1Amount)) || 0).toFixed(2),
                radio: list.value[0]?.radio || "2"
            },
            {
                text: "二",
                Sum: item.Sum2,
                Fee: item.Fee2,
                realRate: formData.realRate2,
                WinAmount: item.Win2Amount,
                LoseAmount: item.Lose2Amount,
                Details: formData.details2,
                WinResult: ((Number(item.Sum2) - Number(item.Win2Amount)) || 0).toFixed(2),
                LoseResult: ((Number(item.Sum2) - Number(item.Lose2Amount)) || 0).toFixed(2),
                radio: list.value[1]?.radio || "2"
            }, {
                text: "三",
                Sum: item.Sum3,
                Fee: item.Fee3,
                realRate: formData.realRate3,
                WinAmount: item.Win3Amount,
                LoseAmount: item.Lose3Amount,
                Details: formData.details3,
                WinResult: ((Number(item.Sum3) - Number(item.Win3Amount)) || 0).toFixed(2),
                LoseResult: ((Number(item.Sum3) - Number(item.Lose3Amount)) || 0).toFixed(2),
                radio: list.value[2]?.radio || "2"
            }
        ]

    } catch (error) { }
    loading.value = false
}
const onSubmit2 = async () => {
    ElMessageBox.confirm("确定结算，是否继续？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        beforeClose: async (action, instance, done) => {
            if (action === "confirm") {
                try {
                    instance.confirmButtonLoading = true;
                    instance.confirmButtonText = "执行中...";
                    const res = await settleOrder({
                        id: formData.id,
                        realRate1: list.value[0].realRate,
                        realRate2: list.value[1].realRate,
                        realRate3: list.value[2].realRate,
                        details1: list.value[0].Details,
                        details2: list.value[1].Details,
                        details3: list.value[2].Details,

                        win1: list.value[0].radio,
                        win2: list.value[1].radio,
                        win3: list.value[2].radio,
                    });
                    done();
                    instance.confirmButtonLoading = false;
                } catch (error) {
                    instance.confirmButtonLoading = false;
                    instance.confirmButtonText = "确认";
                    ElMessage.error(error);
                }
            } else {
                done();
            }
        },
    })
        .then(() => {
            ElMessage.success("成功");
            dialogTableVisible.value = false
            emit("loadData")
        })
        .catch(() => { });

}
const show = (item) => {
    dialogTableVisible.value = true;
    list.value = []
    formData.id = item.Id;
    formData.realRate1 = item.SR1
    formData.realRate2 = item.SR2
    formData.realRate3 = item.SR3
    formData.details1 = item.Details1;
    formData.details2 = item.Details2;
    formData.details3 = item.Details3;

    onSubmit();
}
defineExpose({
    show,
})
</script>
<style lang="scss" scoped>
.right {
    overflow: auto;
}

.el-pagination {
    padding: 15px;
    float: right;
}
</style>